/* ERP系统全局样式 */

/* 主题色变量 */
:root {
  /* 主题颜色 */
  --primary-color: #1890ff;
  --primary-color-rgb: 24, 144, 255; /* 新增RGB格式，用于rgba() */
  --primary-light: #40a9ff;
  --primary-dark: #096dd9;
  --primary-bg: rgba(24, 144, 255, 0.1);
  
  /* 辅助色 */
  --success-color: #52c41a;
  --success-color-rgb: 82, 196, 26;
  --warning-color: #faad14;
  --warning-color-rgb: 250, 173, 20;
  --error-color: #f5222d;
  --error-color-rgb: 245, 34, 45;
  --info-color: #1890ff;
  
  /* 中性色 */
  --text-primary: #262626;
  --text-secondary: #595959;
  --text-tertiary: #8c8c8c;
  --text-quaternary: #bfbfbf;
  
  /* 背景色 */
  --bg-container: #ffffff;
  --bg-layout: #f0f2f5;
  --bg-card: #ffffff;
  
  /* 边框 */
  --border-color-base: #d9d9d9;
  --border-color-split: #f0f0f0;
  
  /* 阴影 */
  --box-shadow-base: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
  --box-shadow-light: 0 2px 8px rgba(0, 0, 0, 0.15);
  
  /* 圆角 */
  --border-radius-base: 4px;
  --border-radius-sm: 2px;
  --border-radius-lg: 8px;
  
  /* 字体 */
  --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
}

/* 常用Flex布局工具类 */
.flex {
  display: flex;
}

.flex-col {
  display: flex;
  flex-direction: column;
}

.flex-center {
  display: flex;
  align-items: center;
  justify-content: center;
}

.flex-between {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.flex-around {
  display: flex;
  align-items: center;
  justify-content: space-around;
}

.flex-start {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.flex-end {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.flex-1 {
  flex: 1;
}

/* 常用间距类 */
.m-xs { margin: 4rpx; }
.m-sm { margin: 8rpx; }
.m-md { margin: 16rpx; }
.m-lg { margin: 24rpx; }
.m-xl { margin: 32rpx; }

.mt-xs { margin-top: 4rpx; }
.mt-sm { margin-top: 8rpx; }
.mt-md { margin-top: 16rpx; }
.mt-lg { margin-top: 24rpx; }
.mt-xl { margin-top: 32rpx; }

.mb-xs { margin-bottom: 4rpx; }
.mb-sm { margin-bottom: 8rpx; }
.mb-md { margin-bottom: 16rpx; }
.mb-lg { margin-bottom: 24rpx; }
.mb-xl { margin-bottom: 32rpx; }

.ml-xs { margin-left: 4rpx; }
.ml-sm { margin-left: 8rpx; }
.ml-md { margin-left: 16rpx; }
.ml-lg { margin-left: 24rpx; }
.ml-xl { margin-left: 32rpx; }

.mr-xs { margin-right: 4rpx; }
.mr-sm { margin-right: 8rpx; }
.mr-md { margin-right: 16rpx; }
.mr-lg { margin-right: 24rpx; }
.mr-xl { margin-right: 32rpx; }

.p-xs { padding: 4rpx; }
.p-sm { padding: 8rpx; }
.p-md { padding: 16rpx; }
.p-lg { padding: 24rpx; }
.p-xl { padding: 32rpx; }

/* 文本类 */
.text-primary { color: var(--text-primary); }
.text-secondary { color: var(--text-secondary); }
.text-tertiary { color: var(--text-tertiary); }
.text-brand { color: var(--primary-color); }
.text-success { color: var(--success-color); }
.text-warning { color: var(--warning-color); }
.text-error { color: var(--error-color); }

.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }

.text-xs { font-size: 20rpx; }
.text-sm { font-size: 24rpx; }
.text-md { font-size: 28rpx; }
.text-lg { font-size: 32rpx; }
.text-xl { font-size: 36rpx; }
.text-xxl { font-size: 40rpx; }

.font-bold { font-weight: bold; }
.font-medium { font-weight: 500; }
.font-normal { font-weight: normal; }

/* 圆角 */
.radius-sm { border-radius: var(--border-radius-sm); }
.radius { border-radius: var(--border-radius-base); }
.radius-lg { border-radius: var(--border-radius-lg); }
.radius-round { border-radius: 100rpx; }
.radius-circle { border-radius: 50%; }

/* 卡片样式 */
.card {
  background-color: var(--bg-card);
  border-radius: var(--border-radius-base);
  padding: 24rpx;
  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.09);
}

.card-hover {
  transition: all 0.3s ease;
}

.card-hover:active {
  transform: scale(0.98);
  opacity: 0.9;
}

/* 动画效果 */
.fade-in {
  animation: fadeIn 0.3s ease-in-out;
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.scale-in {
  animation: scaleIn 0.3s ease-in-out;
}

@keyframes scaleIn {
  from { transform: scale(0.9); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}

/* 页面通用容器 */
.page-container {
  min-height: 100vh;
  background-color: var(--bg-layout);
  padding: 20rpx;
} 